<template>
	<div v-if="showLesson">
		<!-- <div class="subject">
			<p>当前科目：</p>
			<p v-for="x in classSubjectArr"><span v-if="x.status==1" v-html="x.subName"></span></p>
		</div> -->
		<div class="subBox">
			<h3 style="text-align: center;">{{props.classname}}课程表</h3>
			<el-table :data="lessonArr" style="width: 100%" border>
				<el-table-column prop="level" label=" " width="120"/>
			    <el-table-column label="周一">
					<template #default='scope'>
						<div v-if="scope.row.list[0].courseName">
							<p>{{ scope.row.list[0].courseName }}</p>
							<p>{{ scope.row.list[0].courseTea }}</p>
						</div>
						<p v-else>暂无</p>
					</template>
				</el-table-column>
			    <el-table-column prop="name" label="周二"  >
					<template #default='scope'>
						<div v-if="scope.row.list[1].courseName">
							<p>{{ scope.row.list[1].courseName }}</p>
							<p>{{ scope.row.list[1].courseTea }}</p>
						</div>
						<p v-else>暂无</p>
					</template>
				</el-table-column>
			    <el-table-column prop="address" label="周三" >
					<template #default='scope'>
						<div v-if="scope.row.list[2].courseName">
							<p>{{ scope.row.list[2].courseName }}</p>
							<p>{{ scope.row.list[2].courseTea }}</p>
						</div>
						<p v-else>暂无</p>
					</template>
				</el-table-column>
				<el-table-column prop="address" label="周四" >
					<template #default='scope'>
						<div v-if="scope.row.list[3].courseName">
							<p>{{ scope.row.list[3].courseName }}</p>
							<p>{{ scope.row.list[3].courseTea }}</p>
						</div>
						<p v-else>暂无</p>
					</template>
				</el-table-column>
				<el-table-column prop="address" label="周五" >
					<template #default='scope'>
						<div v-if="scope.row.list[4].courseName">
							<p>{{ scope.row.list[4].courseName }}</p>
							<p>{{ scope.row.list[4].courseTea }}</p>
						</div>
						<p v-else>暂无</p>
					</template>
				</el-table-column>
				<el-table-column prop="address" label="周六" >
					<template #default='scope'>
						<div v-if="scope.row.list[5].courseName">
							<p>{{ scope.row.list[5].courseName }}</p>
							<p>{{ scope.row.list[5].courseTea }}</p>
						</div>
						<p v-else>暂无</p>
					</template>
				</el-table-column>
				<el-table-column prop="address" label="周日" >
					<template #default='scope'>
						<div v-if="scope.row.list[6].courseName">
							<p>{{ scope.row.list[6].courseName }}</p>
							<p>{{ scope.row.list[6].courseTea }}</p>
						</div>
						<p v-else>暂无</p>
					</template>
				</el-table-column>
			</el-table>
		</div>
	</div>
	<div v-else>
		<!-- <div class="subject">
			<p>当前科目：</p>
			<p v-for="x in classSubjectArr"><span v-if="x.status==1" v-html="x.subName"></span></p>
		</div> -->
		<p style="margin-top: 10vh;text-align: center;">暂无课表</p>
	</div>

</template>

<script setup>
	import {ClassSubjectList,ClassLesson} from "@/api/wym"
	import {reactive,ref,shallowRef,onMounted,defineEmits,defineProps } from "vue";
	
	const props = defineProps({
		addclassid: Number,
		classname:String
	});
	// console.log(props.addclassid,props.classname)
	
	// 右上角按钮是否能点击
	const emit=defineEmits(['che'])
	
	// 显示课表
	let showLesson=ref(true)
	
	// // 查询班级科目
	// let classSubjectArr=ref([])
	// const classSubjectList=async()=>{
	// 	let res=await ClassSubjectList({
	// 		clazzId:props.addclassid
	// 	})
	// 	console.log("班级科目",res)
	// 	classSubjectArr.value=res
	// }
	
	// 班级课表
	let lessonObj=reactive({})
	let lessonArr=ref([])
	const LessonObj=async()=>{
		let resData=await ClassLesson({
			clazzId:props.addclassid
		})
		// console.log("班级课表",resData)
		let datas = []
		let nullArr=[]
		for(var p in resData){
			// console.log(i, resData[i]);
			if(Object.keys(resData[p]).length === 0){
				nullArr.push(null)
			}
		}
		if(nullArr.length!=5){
			showLesson.value=true
			emit("che",1)
			for(var i in resData){
				let list = [];
				for (var k in resData[i]) {
					list.push({
						courseName: resData[i][k].subName,
						courseTea: resData[i][k].teaName,
						week: k,
						weekIndex: k.substring(1, 2)
					})
				}
				//排序第几课时中的周一到周日
				for (var m = 0; m < list.length; m++) {
					for (var k = m + 1; k < list.length; k++) {
						if (list[m].weekIndex > list[k].weekIndex) {
							let temp = list[m]
							list[m] = list[k]
							list[k] = temp
						}
					}
				}
				// console.log(list)
				datas.push({
					index: i.substring(1, 2),	//i:第1节课
					level: i,
					list: list
				})
			}
			// 给最外层第几节课排序
			for (var i = 0; i < datas.length; i++) {
				for (var k = i + 1; k < datas.length; k++) {
					if (datas[i].index > datas[k].index) {
						let temp = datas[i]
						datas[i] = datas[k]
						datas[k] = temp
					}
				}
			}
			// console.log(datas)
			lessonArr.value = datas
		}else{
			showLesson.value=false
			emit("che",2)
		}
		
		
		// console.log(lessonArr.value[0])
	}
	
	
	
	onMounted(()=>{
		// classSubjectList()
		LessonObj()
	})
</script>

<style scoped lang="less">
	.subject{
		display: flex;
		margin-top: 10px;
		align-items: center;
		span{
			margin: 0 5px;
			background-color: #fff;
			padding: 0 5px;
			font-size: 14px;
		}
	}
	.el-table{
		margin-top: 10px;
		--el-table-header-text-color:#333 !important;
		--el-table-border-color:#d5d5d6
	}
	.subBox{
		background-color: #fff;
		margin-top: 20px;
		padding: 10px 20px;
		box-sizing: border-box;
		padding-bottom: 50px;
	}
</style>